/**
 * @desc:  编辑用户
 * @author qiankui
 * @date 2023-4-15 15:36:12
*/
<template>
    <el-dialog :close-on-click-modal="false" :visible="editFlag" class="zdy-dialog" width="500px" :title="$t('edit')" :before-close="handleCloseDialog">
        <el-form :model="form" class="pop-form-box" :rules="rules" ref="ruleForm">
            <!--用户名-->
            <el-form-item :label="$t('username')" prop="userName">
                <el-input disabled="" v-model="form.userName" clearable></el-input>
            </el-form-item>
            <!--姓名-->
            <el-form-item :label="$t('name')" prop="name">
                <el-input v-model="form.name" :minlength="$rules.name.min"
                          :maxlength="$rules.name.max"
                          show-word-limit></el-input>
            </el-form-item>
            <!--角色-->
            <el-form-item :label="$t('CHARACTERS')">
                <!--请选择角色-->
                <el-select v-model="form.role" :placeholder="$t('Please select a role')">
                    <el-option :label="$t(item.label)" :value="item.value" v-for="(item,index) in docType" :key="index" ></el-option>
                </el-select>
            </el-form-item>
            <div class="footBtnBox">
                <el-button size="small" type="handle" @click="handleCloseDialog">{{this.i18n.t('Cancel')}}</el-button>
                <el-button size="small" type="primary" @click="submitForm">{{this.i18n.t('save')}}</el-button>
            </div>
        </el-form>
    </el-dialog>
</template>

<script>
import request from '@/assets/common/js/utils/request'
import {accountinfoUpdate} from "@/api/zhgl";
import { uploadfileinfodata } from '@/api/globaTableData' //引入接口
export default {
    name: "AddOrEdit",
    components: {},
    props: {
        editFlag: {
            type: Boolean,
            default: false
        },
        editTableRow: {
            type: Object,
            defautl: () => {
                return {}
            }
        }
    },
    watch: {
    },
    data() {
        var validateName = (rule, value, callback) => {
            console.log(value);
            if (value == ''||value==undefined) {
                // 请输入姓名
                callback(new Error(this.i18n.t('Please enter your name')));
            }else if (!this.$rules.name.reg.test(value)) {
                callback(new Error(this.$rules.name.errMsg+'，' + this.$rules.name.min + '~' + this.$rules.name.max +' ' + this.i18n.t('bits')));
            }else {
                callback();
            }
        };
        return {
            rules: {
                name:[
                    { validator: validateName,required: true, trigger: 'blur' }
                ],
            },
            saveDisabled:true,
            loadingTips:false,
            errTips:false,
            percentage:0,
            sbjxArr:null,
            sbxhArr:null,
            form:{
                helpType:1,
                deviceModelId:'',
                modelType:'',
                version:'',
                operator:'',
                fileSize:0
            },
            docType:[
                {
                    // 超级管理员
                    label: 'Super administrator',
                    value: 0
                },
                {
                    // 管理员
                    label:'Administrator',
                    value: 1
                },
                {
                    // 普通用户
                    label: 'common User',
                    value: 2
                }
            ],
            otaglForm: {
                name: '',
                version: "",
                devieModel: '',
                description: "",
            },
            syjxVal: [],
            jxTreeList: [],
            jxArr: [],//包含所有的机型名称和id
            option: {
                type: 'duo', //传spa为单选，duo为多选
                defaultProps: {
                    children: 'children', //同element的原始配置
                    label: 'name', //同element的原始配置
                    valKey: 'id', //v-model回传时的value-key
                }
            },
            zhTipFlag: true,
            fileName: '',
        }
    },
    created() {
        this.form = this.editTableRow
    },
    mounted() {

    },
    methods: {
        /**
         * @description  关闭弹窗事件
         * @return not
         * @author xiongyi 2022-06-29 16:48:08
         **/
        handleCloseDialog() {
            this.$emit('update:editFlag', false);
            this.$emit('update:editTableRow', null);
            if (this.fileName) {
                this.fileName = "";
                this.$refs.upload.clearFiles()
            }
        },
        // 修改回调
        accountinfoUpdate(params) {
            accountinfoUpdate(params).then((res) => {
                if (res.code == 200) {
                    // 修改成功
                    this.W.$tips("success", this.i18n.t('Modified successfully!'));
                    this.parentUpdate();
                }
            }).catch().finally(() => {
            })
        },
        // 刷新列表
        parentUpdate() {
            this.$emit("update:editFlag",false);
            this.$parent.$refs.globalTable.loading_data();
        },
        /**
        * @description  保存新增活修改数据
        * @param  not
        * @return not
        * @author xiongyi 2022-07-06 10:50:18
        **/
        submitForm() {
            this.$refs.ruleForm.validate((valid) => {
                if (valid) {
                    const sendData = JSON.parse(JSON.stringify(this.form));
                    let params = {
                        userName:sendData.userName,
                        name:sendData.name,
                        role:sendData.role,
                        id:sendData.id,
                        password:this.form.password,
                        createBy:this.form.createBy
                    }
                    this.accountinfoUpdate(params);
                }
            })
        }
    }
}
</script>

<style scoped lang="scss">
.zh-tip {
    position: relative;
    color: #727b8f;
    text-align: right;
    .tb-btn {
        color: #4264d0;
        text-decoration: underline;
        cursor: pointer;
    }
}
.dia-sc-btn {
    background-color: transparent;
    border: 1px dashed rgba(55, 101, 215, 0.5);
    color: rgba(55, 101, 215, 0.5);
}
</style>
